<template>
  <div class="listheader">
    <div class="top">
        <router-link class="iconfont back-icon" tag="span" to="/category">&#xe771;</router-link>
        <!-- <span class="iconfont back-icon">&#xe771;</span> -->
        <span class="sort"><!--{{this.$store.state.city}}--></span>
    </div>
    <div class="bottom">
        <ul class="nav">
            <li>默认</li>
            <li>官网</li>
            <li>品牌</li>
            <li class="price">价格<span class="iconfont">&#xe60c;</span></li>
        </ul>
    </div>
  </div>
</template>

<script>
export default {
  name: 'List',
  data () {
    return {
      
    }
  }
}
</script>


<style lang="stylus" scoped>
.listheader
    width 100%
    height auto
    background-color #fff
    z-index 99
    position fixed  
    .top
        width 100%
        font-size .36rem
        font-weight bold
        line-height .36rem
        text-align center
        padding .2rem 
        .iconfont 
            font-size .44rem 
        .back-icon 
            float left
        .sort
            margin-left -.8rem
    .bottom
        width 100%
        height .8rem
        // background-color red
        ul
            width 100%
            float left
            border-top 1px solid rgba(239,239,239,0.6)
            border-bottom 1px solid rgba(239,239,239,0.6)
            li 
                width 24.7%
                float left
                font-size .28rem
                line-height .28rem
                text-align center
                padding .25rem 0 
                border-right 1px solid rgba(239,239,239,0.6)
            .price 
                border-right  none
</style>
